<html>
  <body>
    <div
      class="codepen"
      data-theme-id="36294"
      data-prefill
      data-editable="true"
      data-height="100%"
      data-theme-id="1"
      data-default-tab="css,result"
    >
      <pre data-lang="css">
/*
Step 1 Exercise

The power of HTML is its ability to represent complex information in a way that conveys meaning. In this exercise you are going to be creating an HTML page for my favorite recipe.

## The Exercise

1. Create a recipe page to host our recipe
2. Use header, main, footer, headings (h1/h2 etc), paragraphs, lists
3. Use ordered and unordered lists appropriately
4. Add the `baked_beans.jpg` image: https://raw.githubusercontent.com/Microsoft/frontend-bootcamp/master/step1-01/exercise/baked_beans.jpg
5. Add an anchor tag around 'Wisconsin Beer Brats'

> Note that CodePen takes care of the `HTML` and `Body` tags, so you can simply start with the content

## The Recipe

Title:
4th of July Baked Beans

Description:
It's great how a single meal can take you back dozens of years. This is one of those recipes that never seems to fail to impress.

I learned this recipe from the cousin of one of my college friends back in Nashville Tennessee. We had an amazing 4th of July feast which included this recipe and some bratwurst like these Wisconsin Beer Brats https://www.culinaryhill.com/wisconsin-beer-brats/

Prep Time: 10 minutes
Cook time: 3+ hours
Servings: 12

Ingredients:
1LB Bacon chopped
3 Cans Bush's Original Baked Beans
1 Walla Wall Onion chopped
3 ground garlic cloves
4 Tablespoons of mustard
3 Tablespoons of molasses
4 Tablespoons of brown sugar

Directions:
Cook bacon until it is mostly cooked, then drain most of the grease and put aside
Cook onion in remaining bacon grease
Combine onions and bacon, then add garlic, cook for a few more minutes
Add beans and get up to simmer temperature
Add mustard until your beans are nice and yellow
Add molasses until color darkens again
Add brown sugar until properly sweet
Simmer for a long time, occasionally stirring

Expert Tips:
Burning off most of the liquid gives you nice, hearty, sticky beans.
If the beans get too dry, you can always add beer!

Nutritional Information:
Calories: lots
Fat: lots
Fun: lots

*/

      </pre>
      <pre data-lang="html">Add Recipe Here</pre>
    </div>

    <script async src="https://static.codepen.io/assets/embed/ei.js"></script>
  </body>
</html>
